<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>集成第三方CSS库</title>
    <link rel="stylesheet" type="text/css" href="animate.css"/>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <style>
        .slideInRight {
            transform: translateX(200px);
        }

        .go {
            transition: all 2s ease-out;
        }
    </style>
</head>
<body>

<div id="app">
    <button @click="taxiCalled=true">打车</button>
    <!--<transition enter-active-class="animated slideInRight">-->
    <transition
            enter-class="slideInRight"
            enter-active-class="go">
        <p v-if="taxiCalled">🚗</p>
    </transition>
    <!--</transition>-->
</div>

<script type="text/javascript">
    new Vue({
        el: '#app',
        data: {
            taxiCalled: false
        }
    })
</script>
</body>
</html>